/**
 * @fileOverview 基于jquery节点封装的视图基类
 * @author goodzsq@gmail.com
 */
var BaseClass = gg.module('ui.jq.Component');
module.exports = gg.createClass({
    attributes: {
        title: {
            defaultValue: '按钮',
            setter: function(v) {
                this.defaultSetter('title', v);
                this.refresh();
            }
        },
        icon: {
            setter: function(v) {
                this.defaultSetter('icon', v);
                this.refresh();
            }
        },
        disable: {
            type: 'datatype.Boolean',
            setter: function(v) {
                this.defaultSetter('disable', v);
                if (v) {
                    this.el.attr('disabled', true);
                } else {
                    this.el.removeAttr('disabled');
                }
            }
        },
        menu: {
            type: 'ui.jq.Menu',
            setter: function(v) {
                this.defaultSetter('menu', v);
                if(v){
                    $('body').append(v.el);
                }
                this.refresh();
            }
        }
    },
    methods: {
        refresh: function() {
            if(!this.inited){
                return;
            }
            console.log('refresh', this.cid);
            var title = this.get('title');
            var icon = this.get('icon');
            var menu = this.get('menu');
            var html = title;
            if (icon) {
                html = '<span class="glyphicon glyphicon-' + icon + '"></span> ' + title;
            }
            if(menu){
                html += ' <b class="caret">';
            }
            this.el.html(html);
        },
        /**
         * @override
         */
        createElement: function() {
            var css = 'ui btn btn-default';
            this.el = this._buildHtml({tag: 'button', type: 'button', id: this.cid, class: css});
            var self = this;
            this.el.bind('click', function() {
                self.triggerEvent('click');
                var menu = self.get('menu');
                if(menu){
                    var offset = self.el.offset();
                    menu.show(offset.left, offset.height + self.el.height());
                }
            });
        }
    },
    events: {
        click: '点击'
    }
}, BaseClass, []);